<template>
	<view class="box">
		<view class="title mlr-36 bold">
			{{type == 1 ? '账号登录' : '验证码登录'}}
		</view>
		<view class="mlr-36 gray-2 mt-20">
			{{type==1?'如账号未设置密码，请使用验证码登录方式':'请使用手机号，快速登录'}}
		</view>
		<view class="mlr-36 mt-10">
			<sar-input v-model="tel" placeholder="请输入手机号" />
		</view>
		<view class="code mlr-36 flex" v-if="type==2">
			<input type="text" v-model="code" placeholder="请输入验证码" />
			<view class="code1 white text-center" @click="getcode">
				{{vscode}}
			</view>
		</view>
		<view class="mlr-36 mt-10">
			<sar-input placeholder="请输入密码" type="password" show-eye />
		</view>
		<view class="mt-10 mlr-36">
			<sar-button type="default" @click="submit" size="large">
				登录
			</sar-button>
		</view>
		<view class="agree-radio">
			<sar-checkbox-group v-model="agreeRadio">
				<sar-checkbox checked type="circle"></sar-checkbox>
				<view class="p">
					已阅读并同意<text class="t" @click="handleClick(4)">《用户隐私协议》</text>和<text class="t" @click="handleClick(8)">《用户服务协议》</text>
				</view>
			</sar-checkbox-group>
		</view>
	</view>
</template>

<script setup>
	import { dialog } from 'sard-uniapp'
	import http from "@/request/index.js"
	import Md5 from "js-md5"
	import { toast } from 'sard-uniapp'
	const type = ref(1); // 1=登录15689741124，2=验证码登录13298388704
	const tel = ref('');
	const pwd = ref('');
	const agreeRadio = ref([])
	const handleClick = (t) => {
		uni.navigateTo({
			url: `/pages/rules/infoRules?t=${t}`
		})
	}
	const submit = async() => {
		if (!agreeRadio.value.length) return dialog.alert({
			title: '提示',
			message: '请先阅读并同意《用户隐私协议》和《用户服务协议》',
		})
		if (type.value == 1) {
			// 密码登录
			let res = await http('/api/app/auth/login', {
				account: tel.value,
				password: Md5(pwd.value),
				// app_type: 1
			}, true, 'POST')
			console.log(res, 'resres');
			// if (code != 200) {
			//   toast(`失败: ${msg}`);
			// }
			// toast(`登录成功`)
			// uni.setStorageSync('token', data.token)
			// uni.setStorageSync('authId', data.authId)
			// getApp().globalData.loginType = true; //改变登录状态
			// getApp().isLocationEnable();
			// if (!data.isChange) {
			// 	uni.redirectTo({ url: '/pages/login/changePwd' })
			// } else {
			// 	setTimeout(() => {
			// 		uni.switchTab({ url: '/pages/index/index' })
			// 	}, 1000)
			// }
		}
	}
</script>

<style lang="scss" scoped>
	::v-deep .sar-checkbox-group{
		flex-direction: row;
	}
	.agree-radio {
		width: 85%;
		margin: 40rpx auto;
		text-align: center;
		font-size: 30rpx;
		.u-checkbox {
			align-items: normal;
			padding-top: 4px;
		}
		.p {
			display: inline;
			text-align: left;
			margin-left: 10px;
		}
		.t {
			color: blue;
		}
	}
	.box {
		width: 100%;
		height: 100vh;
		background: url(../../static/login-bg.png) no-repeat;
		background-size: 100% 100%;
		overflow: hidden;
	
		.title {
			margin-top: 180px;
			font-size: 20px;
		}
	
		.code {
			margin-top: 10rpx;
			padding-top: 14rpx;
			padding-bottom: 15rpx;
			border-bottom: 1rpx solid #f5f6f7;
	
			input {
				margin-left: 8rpx;
				font-size: 26rpx;
			}
	
			.code1 {
				width: 180rpx;
				height: 70rpx;
				font-size: 26rpx;
				line-height: 70rpx;
				// background: $bg-1;
			}
		}
	
		.line {
			width: 178rpx;
			height: 2rpx;
			background: #eee;
		}
	
		.img {
			image {
				width: 92rpx;
				height: 92rpx;
			}
		}
	}
</style>
